<template>
  <div>
    <a-card title="七牛上传">
      <upload-qn :limit="4" v-model="images" />
    </a-card>
    <a-card title="阿里云上传">
      <upload-ali :limit="4" v-model="images" />
    </a-card>
    <a-card style="height: 330px;" title="城市选择">
      <region-select v-model="region" @change="changeRegion" :level="1" />
      <p>{{region_name}}： {{region}}</p>
    </a-card>
    <a-card title="地图组件">
      <vue-amap keyword="北京"></vue-amap>
    </a-card>
    <a-card title="二维码">
      <vue-qrcode url="https://www.baidu.com"></vue-qrcode>
    </a-card>
    <a-card title="弹窗">
      <a-button @click="visible = true" type="primary">打开弹窗</a-button>
      <vue-dialog v-model="visible">
        <a-button>测试</a-button>
      </vue-dialog>
    </a-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      images: [
        { url: "http://pic.kuan1.top/e12720a8cee945216bc5e516fcb36028.png" },
        { url: "http://pic.kuan1.top/0b5934b623f3c6f5377f221959d77982.gif" },
        { url: "http://pic.kuan1.top/38d54e7711a19ac1ca08f134934bdbf3.png" }
      ],
      visible: false,
      region: ["0"],
      region_name: "全国"
    };
  },
  methods: {
    changeRegion(value, region_name) {
      this.region_name = region_name;
    }
  }
};
</script>

<style>
</style>